<template>
<uni-shadow-root class="partials-activitiesGoods-activitiesGoods"><block v-if="data.androidTemplate == ''">
    
    <view class="mt20">
        <scroll-view class="recommend_scroll_x_box" scroll-x="true">
          <block v-for="(item,index) in (data.relateBean.products)" :key="item.index">
              <view class="recommend_hot_box" :style="'background-color:'+(color)+';'" @click="clickLink" :data-id="item.id" :data-index="item.id">
                <view class="CouponsImg">   <image mode="aspectFill" :src="item.imagePath"></image> </view>
                <view class="choose" :style="'background-color:'+(setting.defaultColor)+';'"> <text>去抢购</text> </view>
              </view>
                  <view class="recommend_hot_box_copy" v-if="index==data.relateBean.products.length-1" :style="'background-color:'+(color)+';'" @click="clickLink1" :data-id="data.relateBean.id">
               <text :style="'color:'+(setting.defaultColor)">更多商品</text>
              </view> 
          </block> 
        </scroll-view>
     <view class="footer" :style="'background: linear-gradient(to right, '+(setting.defaultColor)+' , '+(setting.secondColor)+');'">
        <view class="activeName"><text>{{data.relateBean.name}}</text></view>
        <view class="time">
             <view class="timeText"> <text>{{data.relateBean.promotionStatus==0?"即将开始:":"距结束:"}}</text></view>
             <view class="timeBox" :style="'color:'+(setting.defaultColor)"> <text>{{countDownDay}}天</text></view>
             <view class="timeText"> <text>:</text></view>
             <view class="timeBox" :style="'color:'+(setting.defaultColor)"> <text>{{countDownHour}}</text></view>
              <view class="timeText"> <text>:</text></view>
             <view class="timeBox" :style="'color:'+(setting.defaultColor)"> <text>{{countDownMinute}}</text></view>
              <view class="timeText"> <text>:</text></view>
             <view class="timeBox" :style="'color:'+(setting.defaultColor)"> <text>{{countDownSecond}}</text></view>
        </view>
     </view>
    </view>
</block> 
<block v-if="data.androidTemplate == 'column_promotion_list'">
    
    <view class="promotion_product_list">
      <view v-for="(item,index) in (data.relateBean.products)" :key="item.index" class="promotion_product_item" @click="clickLink" :data-id="item.id">
        <view class="promotion_product_head">
          <image class="promotion_product_img" mode="aspectFill" :src="item.imagePath"></image>
          <view class="promotion_time" v-if="data.relateBean.id">
            <view class="promotion_end_time" :style="'border:1rpx solid '+(setting.defaultColor)+';'">
              <text class="promotion_end_time_text" :style="'background:'+(setting.defaultColor)+';'">结束</text>
              <text class="promotion_end_time_value" :style="'color:'+(setting.defaultColor)+';'">{{data.relateBean.endDate}}</text>
            </view>
          </view>
        </view>
        <view class="promotion_product_info">
          <text class="promotion_product_name">{{item.name}}</text>
          <view class="promotion_product_bottom">
            <view class="promotion_product_allprice">
              <text class="promotion_product_price">￥{{item.price}}</text>
              <text class="promotion_product_tagprice">￥{{item.tagPrice}}</text>
            </view>
            <view class="promotion_product_buy" :style="'background:'+(setting.defaultColor)">
              <text>去抢购</text>
            </view>
          </view>
        </view>
      </view>
    </view>
</block> 
<block v-if="data.androidTemplate == 'pupu_promotion_list'">
    
    <view class="pupu_promotion_top" v-if="data.relateBean.promotionStatus!=2">
      <text class="pupu_promotion_name">{{data.relateBean.name}}</text>
      <view class="pupu_promotion_right">
        <view class="pupu_promotion_time">
          <text class="pupu_promotion_time_title">{{data.relateBean.promotionStatus==0?"抢购开始倒计时:":"抢购结束倒计时:"}}</text>
          <view class="pupu_promotion_time_value">
            <view class="pupu_promotion_time_value_item_value"> <text>{{countDownDay}}/D</text></view>
            <view class="colon"> <text></text></view>
            <view class="pupu_promotion_time_value_item_value"> <text>{{countDownHour}}</text></view>
            <view class="colon"> <text>:</text></view>
            <view class="pupu_promotion_time_value_item_value"> <text>{{countDownMinute}}</text></view>
            <view class="colon"> <text>:</text></view>
            <view class="pupu_promotion_time_value_item_value"> <text>{{countDownSecond}}</text></view>
          </view>
          <view class="pupu_promotion_more" @click="clickLink1" :data-id="data.relateBean.id">
            <text class="pupu_promotion_more_text">更多</text>
            <image class="pupu_promotion_more_icon" src="https://image1.sansancloud.com/xianhua/2019_4/3/18/3/24_160.jpg?x-oss-process=style/preview_120"></image>
          </view>
        </view>
      </view>
    </view>
    <view class="pupu_promotion_list">
      <view v-for="(item,index) in (data.relateBean.products)" :key="item.index" class="pupu_promotion_item" @click="clickLink" :data-id="item.id" :data-index="item.id">
        <view class="pupu_promotion_item_img">
          <image mode="aspectFill" class="pupu_promotion_item_url" :src="item.imagePath"></image>
        </view>
        <view class="pupu_promotion_item_info">
          <text class="pupu_promotion_item_name">{{item.name}}</text>
          <view class="pupu_promotion_item_price" v-if="item.promotion">
            ￥<text class="pupu_promotion_item_true_price">{{item.promotionPrice}}</text>
            <view class="font_color" v-if="item.tagPrice>item.price&&item.tagPrice>item.promotionPrice">/<text class="pupu_promotion_item_tagprice">￥{{item.tagPrice}}</text></view>
          </view>
          <view class="pupu_promotion_item_price" v-else>
            ￥<text class="pupu_promotion_item_true_price">{{item.price}}</text>
            <view class="font_color" v-if="item.tagPrice>item.price">/<text class="pupu_promotion_item_tagprice">￥{{item.tagPrice}}</text></view>
          </view>
          <text class="pupu_promotion_item_unit">{{item.unitShow}}</text>
          <text class="pupu_promotion_item_cart" :style="'background:'+(setting.secondColor)" v-if="data.relateBean.promotionStatus==0">收藏</text>
          <text class="pupu_promotion_item_cart" :style="'background:'+(setting.defaultColor)" v-if="data.relateBean.promotionStatus==1">立即抢购</text>
          <text class="pupu_promotion_item_cart" v-if="data.relateBean.promotionStatus==2">活动结束</text>
        </view>
      </view>
    </view>
</block> 
<block v-if="data.androidTemplate == 'pupu_promotion_detail_list'">
    
    <view class="pupu_promotion_detail_top">
      <text class="pupu_promotion_detail_name">{{data.relateBean.name}}</text>
      <view class="pupu_promotion_detail_right">
        <view class="pupu_promotion_detail_time">
          <text class="pupu_promotion_detail_time_title">{{data.relateBean.promotionStatus==0?"抢购开始倒计时:":"抢购结束倒计时:"}}</text>
          <view class="pupu_promotion_detail_time_value" v-if="data.relateBean.promotionStatus!=2">
            <view class="pupu_promotion_detail_time_value_item_value"> <text>{{countDownDay}}/D</text></view>
            <view class="colon"> <text></text></view>
            <view class="pupu_promotion_detail_time_value_item_value"> <text>{{countDownHour}}</text></view>
            <view class="colon"> <text>:</text></view>
            <view class="pupu_promotion_detail_time_value_item_value"> <text>{{countDownMinute}}</text></view>
            <view class="colon"> <text>:</text></view>
            <view class="pupu_promotion_detail_time_value_item_value"> <text>{{countDownSecond}}</text></view>
          </view>
          <view class="over_promotion" v-else>活动已结束</view>
          <view class="pupu_promotion_detail_more" @click="clickLink1" :data-id="data.relateBean.id">
            <text class="pupu_promotion_detail_more_text">更多</text>
            <image class="pupu_promotion_detail_more_icon" src="https://image1.sansancloud.com/xianhua/2019_4/3/18/3/24_160.jpg?x-oss-process=style/preview_120"></image>
          </view>
        </view>
      </view>
    </view>
    <view class="pupu_promotion_detail_list">
      <view v-for="(result,index) in (data.relateBean.products)" :key="result.index" class="product_items3" @click="clickLink" :data-id="result.id" :data-index="result.id">
          <view class="product_items3_promotion_name" v-if="result.tagArray[0]">{{result.tagArray[0]}}</view>
          <image class="product_items3_img" mode="aspectFill" :src="(result.imagePath)+'?x-oss-process=style/preview'"></image>
          <view class="product_items3_view1">
            <text class="product_name">{{result.name}}</text>
            <text class="location_name" v-if="result.longitude>0">{{result.location}}</text>
            <text class="location_name" v-else>{{result.description}}</text>
            <view class="sale_item3" :style="'border:1rpx solid '+(setting.defaultColor)" v-if="result.itemSpecialSaleType!=0">
              <view class="sale_item3_title" :style="'background:'+(setting.defaultColor)">
                <text v-if="result.itemSpecialSaleType==1">满减</text>
                <text v-if="result.itemSpecialSaleType==2">买赠</text>
                <text v-if="result.itemSpecialSaleType==3">限购</text>
              </view>
              <view class="sale_item3_value" v-if="result.itemSpecialSaleType==1" :style="'color:'+(setting.defaultColor)">
                满<text>{{result.itemSpecialSaleValue1}}元</text>减<text>{{result.itemSpecialSaleValue2}}元</text>
              </view>
              <view class="sale_item3_value" v-if="result.itemSpecialSaleType==2" :style="'color:'+(setting.defaultColor)">
                买<text>{{result.itemSpecialSaleValue1}}</text>赠<text>{{result.itemSpecialSaleValue2}}</text>
              </view>
              <view class="sale_item3_value" v-if="result.itemSpecialSaleType==3" :style="'color:'+(setting.defaultColor)">
                限购<text>{{result.itemSpecialSaleValue1}}件</text>
              </view>
            </view>
            <text class="location_name">{{result.unitShow}}</text>
            <view class="product_price">
              <text class="price" v-if="result.promotion>0">￥{{result.promotionPrice}}</text>
              <text class="price" v-else>￥{{result.price}}</text>
              <text class="price" v-if="result.maxPrice>result.price">-{{result.maxPrice}}</text>
              <text v-if="result.maxPrice<=result.price&&result.tagPrice>result.price" class="tag_price">￥{{result.tagPrice}}</text>
            </view>
          </view>
          <view class="to_car3" :style="'background:'+(defaultColor)" v-if="jsonData.showCard==1" @click.stop.prevent="readyAddCar" :data-product="result">
            <image v-if="result.promotion==0" class="to_car3_icon" src="https://image1.sansancloud.com/xianhua/2019_3/20/10/45/42_450.jpg?x-oss-process=style/preview_120"></image>
            <text style="font-size:24rpx;padding:0rpx 10rpx;" v-if="result.promotion!=0">立即抢购</text>
            <text class="to_car3_text" v-else>选购</text>
          </view>
        </view>
    </view>
</block></uni-shadow-root>
</template>

<script>

global['__wxRoute'] = 'partials/activitiesGoods/activitiesGoods'
const app = getApp();
Component({
  properties: {
    data: {
      type: JSON,
      value: 'default value',
    }
  },
  data: {
    someData: {},
    color:"",
    countDownDay: "",
    countDownHour: "",
    countDownMinute: "",
    countDownSecond: "",
    setting:{},
  },
  ready: function (options) {
    var that=this;
    var oldData = that.data;
    app.globalData.consoleFun("=====activitiesGoods组件-导航=====",[that.data.data])
    that.setData({ setting: app.globalData.setting.platformSetting})
    if (oldData.data.relateBean.promotionStatus == 1&&oldData.data.relateBean.endDate) {
      var interval = setInterval(function () {
        var t1 = oldData.data.relateBean.endDate;
        var d1 = t1.replace(/\-/g, "/");
        var date1 = new Date(d1);
        var totalSecond = parseInt((date1 - new Date()) / 1000);
        var second = totalSecond;
        var day = Math.floor(second / 3600 / 24);
        var dayStr = day.toString();
        if (dayStr.length == 1) dayStr = '0' + dayStr;
        var hr = Math.floor((second - day * 3600 * 24) / 3600);
        var hrStr = hr.toString();
        if (hrStr.length == 1) hrStr = '0' + hrStr;
        var min = Math.floor((second - day * 3600 * 24 - hr * 3600) / 60);
        var minStr = min.toString();
        if (minStr.length == 1) minStr = '0' + minStr;
        var sec = second - day * 3600 * 24 - hr * 3600 - min * 60;
        var secStr = sec.toString();
        if (secStr.length == 1) secStr = '0' + secStr;
        this.setData({
          countDownDay: dayStr,
          countDownHour: hrStr,
          countDownMinute: minStr,
          countDownSecond: secStr,
        });
        totalSecond--;
        if (totalSecond < 0) {
          clearInterval(interval);
          wx.showToast({
            title: '活动已结束',
          });
          this.setData({
            countDownDay: '00',
            countDownHour: '00',
            countDownMinute: '00',
            countDownSecond: '00',
          });
        }
      }.bind(this), 1000);
    }
    if (oldData.data.relateBean.promotionStatus == 0&&oldData.data.relateBean.startDate) {
      var interval = setInterval(function () {
        var t1 = oldData.data.relateBean.startDate;
        var d1 = t1.replace(/\-/g, "/");
        var date1 = new Date(d1);
        var totalSecond = parseInt((date1 - new Date()) / 1000);
        var second = totalSecond;
        var day = Math.floor(second / 3600 / 24);
        var dayStr = day.toString();
        if (dayStr.length == 1) dayStr = '0' + dayStr;
        var hr = Math.floor((second - day * 3600 * 24) / 3600);
        var hrStr = hr.toString();
        if (hrStr.length == 1) hrStr = '0' + hrStr;
        var min = Math.floor((second - day * 3600 * 24 - hr * 3600) / 60);
        var minStr = min.toString();
        if (minStr.length == 1) minStr = '0' + minStr;
        var sec = second - day * 3600 * 24 - hr * 3600 - min * 60;
        var secStr = sec.toString();
        if (secStr.length == 1) secStr = '0' + secStr;
        this.setData({
          countDownDay: dayStr,
          countDownHour: hrStr,
          countDownMinute: minStr,
          countDownSecond: secStr,
        });
        totalSecond--;
        if (totalSecond < 0) {
          clearInterval(interval);
          this.setData({
            countDownDay: '00',
            countDownHour: '00',
            countDownMinute: '00',
            countDownSecond: '00',
          });
        }
      }.bind(this), 1000);
    }
  },
  methods: {
    tolinkUrl: function (event) {
      app.globalData.linkEvent(event.currentTarget.dataset.link);
    },
    clickLink: function (e) {
      console.log(e)
      var oldData = this.data;
      if (oldData.data.relateBean.promotionStatus == 1) {
        console.log("=====已开始的活动========")
        var a = "product_detail.html?productId=" + e.currentTarget.dataset.id;
        app.globalData.linkEvent(a);
      }else if (oldData.data.relateBean.promotionStatus == 0) {
        console.log("=====未开始的活动========")
        var a = "promotion_detail.html?promotionId=" + e.currentTarget.dataset.id;
        app.globalData.linkEvent(a);
      }else if (oldData.data.relateBean.promotionStatus == 2) {
        console.log("=====已结束的活动========")
        var a = "product_detail.html?productId=" + e.currentTarget.dataset.id;
        app.globalData.linkEvent(a);
      }
    },
    clickLink1: function (e) {
      var oldData = this.data;
      if (oldData.data.relateBean.promotionStatus == 1) {
        wx.navigateTo({
          url: '../../pageTab/tunzai/teMai/index?promotionId=' + e.currentTarget.dataset.id,
        })
      }
      if (oldData.data.relateBean.promotionStatus == 0) {
        var a = "promotion_detail.html?promotionId=" + e.currentTarget.dataset.id;
        app.globalData.linkEvent(a);
      }
    },
  },
})
export default global['__wxComponents']['partials/activitiesGoods/activitiesGoods']
</script>
<style platform="mp-weixin">
@import 'column_promotion_list/column_promotion_list.css';
@import 'pupuPromotionList/index.css';
@import 'pupuPromotionDetailList/index.css';
.recommend_scroll_x_box {
  height: 242rpx;
  white-space: nowrap;
  display: flex;
}
.mt20{
  margin-top: 20rpx;
}
.recommend_hot_box {
  width: 222rpx;
  height: 222rpx;
  margin-left: 24rpx;
  display: inline-block;
  text-align: center;
  position: relative;
}
.recommend_hot_box_copy{
  width: 222rpx;
  height: 230rpx;
  margin-left: 24rpx; 
  display: inline-block;
  text-align: center;
  position: relative;
  top: -100rpx; 
}
.recommend_hot_box_copy text{
  font-size: 32rpx;
  line-height: 222rpx;
}
.CouponsImg {
  width: 222rpx;
  height: 222rpx;
  overflow: hidden;
}
.CouponsImg image{
  width: 100%;
  height: 100%;
}
.choose{
  width: 100rpx;
  height: 50rpx;
  position: absolute;
  right: 5rpx;
  bottom: 15rpx;
  background-color: #FE313C;
  z-index: 1000;
  text-align: center;
  border-radius: 20rpx;
}
.choose text{
  display: block;
  font-size: 24rpx;
  line-height: 50rpx;
  color: white;
}
.footer{
  width: 750rpx;
  height: 80rpx;
  background: linear-gradient(to right, #F44 , #FF8B8B);
  margin-top: 30rpx;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.activeName{
  width: 280rpx;
  height: 80rpx;
  text-align: left;
  overflow:hidden; 
  text-overflow:ellipsis;
  white-space:nowrap;
}
.activeName text{
    font-size: 40rpx;
    line-height: 80rpx;
    color: white;
    margin-left: 10rpx;
}
.time{
  width: 450rpx;
  height: 80rpx;
  display: flex;
  flex-direction: row;
}
.timeText{
  text-align: center;
  margin-right: 5rpx;
}
.timeText text{
  font-size: 28rpx;
  line-height: 80rpx;
  color: white;
}
.timeBox{
  width: 60rpx;
  height: 40rpx;
  background-color: white;
  margin-top: 20rpx;
  text-align: center;
  margin-right: 10rpx;
  border-radius: 10rpx;
}
.timeBox text{
  display: block;
  font-size: 20rpx;
  line-height: 40rpx;
}
</style>